<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <form name="reg_testdate">
    <select name="YYYY" onchange="YYYYDD(this.value); point();">
      <option value="">请选择 年</option>
    </select>
    <select name="MM" onchange="MMDD(this.value); point(); ">
      <option value="">选择 月</option>
    </select>
    <select name="DD" onchange="point();">
      <option value="">选择 日</option>
    </select>
    <input type="text" id="out" value="">
  </form>

  <script language="JavaScript">
    function YYYYMMDDstart() {
      MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

      //先给年下拉框赋内容 
      var y = new Date().getFullYear();
      for (var i = (y - 30); i < (y + 30); i++) //以今年为准，前30年，后30年   
        document.reg_testdate.YYYY.options.add(new Option(" " + i + " 年", i));

      //赋月份的下拉框   
      for (var i = 1; i < 13; i++)
        document.reg_testdate.MM.options.add(new Option(" " + i + " 月", i));

      document.reg_testdate.YYYY.value = y;
      document.reg_testdate.MM.value = new Date().getMonth() + 1;
      var n = MonHead[new Date().getMonth()];
      if (new Date().getMonth() == 1 && IsPinYear(YYYYvalue)) n++;
      //赋日期下拉框Author:meizz   
      writeDay(n);
      document.reg_testdate.DD.value = new Date().getDate();
    }

    if (document.attachEvent)
      window.attachEvent("onload", YYYYMMDDstart);
    else
      window.addEventListener('load', YYYYMMDDstart, false);

    function YYYYDD(str) //年发生变化时日期发生变化(主要是判断闰平年)   
    {
      var MMvalue = document.reg_testdate.MM.options[document.reg_testdate.MM.selectedIndex].value;
      if (MMvalue == "") {
        var e = document.reg_testdate.DD;
        optionsClear(e);
        return;
      }
      var n = MonHead[MMvalue - 1];
      if (MMvalue == 2 && IsPinYear(str)) n++;
      writeDay(n)
    }

    function MMDD(str) //月发生变化时日期联动   
    {
      var YYYYvalue = document.reg_testdate.YYYY.options[document.reg_testdate.YYYY.selectedIndex].value;
      if (YYYYvalue == "") {
        var e = document.reg_testdate.DD;
        optionsClear(e);
        return;
      }
      var n = MonHead[str - 1];
      if (str == 2 && IsPinYear(YYYYvalue)) n++;
      writeDay(n);
    }

    function writeDay(n) //据条件写日期的下拉框,并且返回 date 天数
    {
      var e = document.reg_testdate.DD;
      optionsClear(e);
      for (var i = 1; i < (n + 1); i++)
        e.options.add(new Option(" " + i + " 日", i));
    }

    function IsPinYear(year) //判断是否闰平年   
    {
      return (0 == year % 4 && (year % 100 != 0 || year % 400 == 0));
    }

    function optionsClear(e) {
      e.options.length = 1;
    }
    // 选择完后在下面显示出年月日

    function point() {
      let y = document.getElementsByName('YYYY');
      let yNode = y[0].options;
      let year = yNode[y[0].selectedIndex].value;

      let m = document.getElementsByName('MM');
      let mNode = m[0].options;
      let month = mNode[m[0].selectedIndex].value;

      let d = document.getElementsByName('DD');
      let dNode = d[0].options;
      let date = dNode[d[0].selectedIndex].value;
      if (!date.length) {
        date = '**';
      }
      var result = year + '  年  ' + month + '  月 ' + date + ' 日';
      var out = document.getElementById('out');
      out.value = result;
    }
  </script>
</body>

</html>